/* 基础样式 */
@use "./element-theme.scss" as *;

/* 导入Element Plus的基础样式 */
@import "element-plus/dist/index.css";
@import "element-plus/theme-chalk/dark/css-vars.css";

:root {
  /* 默认亮主题 */
  --bg-color: #fff;
  background-color: var(--bg-color);
}

:root.dark {
  /* 暗主题 */
  --bg-color: #141414;
}

::view-transition-old(root),
::view-transition-new(root) {
  animation: none;
  mix-blend-mode: normal;
}

::view-transition-old(root) {
  z-index: 1;
}

::view-transition-new(root) {
  z-index: 2147483646;
}

html.dark::view-transition-old(root) {
  z-index: 2147483646;
}

html.dark::view-transition-new(root) {
  z-index: 1;
}

#app {
  width: 100vw;
  height: 100vh;
  overflow: auto;
  box-sizing: border-box;
}

/* 禁止默认聚焦样式 */
.aside *:focus-visible,
.header *:focus-visible {
  outline: none !important;
}

/** 基础样式 */
.iconfont {
  font-size: 14px;
}

// 主体内容
.el-main {
  background-color: #f1f3f6;

  .main {
    height: 100%;
    border-radius: 10px;

    .page {
      width: 100%;
      height: 100%;
      display: flex;
      flex-direction: column;
      padding: 20px;
      box-sizing: border-box;
      background-color: var(--bg-color);
      .table {
        flex: auto;
        overflow: auto;

        .table_menu {
          width: 100%;
          height: 60px;
          overflow: auto;

          .el-row {
            margin: 0 !important;
          }
        }
      }

      .footer {
        margin-top: 20px;
      }

      .el-table--fit .el-table__inner-wrapper::before {
        display: none;
      }
    }
  }
}

/** 查询表单 */
.query_form {
  padding-bottom: 30px;

  .el-form-item {
    .el-form-item__label {
      font-weight: 700;
    }
  }
}

// 分页
.footer {
  .el-pagination {
    justify-content: flex-end;
  }
}

// 暗主题样式
.dark {
  .el-main {
    background-color: var(--bg-color);
    .main {
      background-color: var(--bg-color);
    }
  }
}

// 菜单深色主题样式
.darkTheme {
  .sidebar_logo {
    background-color: #1e293b;

    .title {
      color: #fff;
    }
  }

  .el-menu {
    --el-menu-bg-color: #1e293b;
    --el-menu-text-color: #ffffff;
    --el-menu-active-color: #409eff;
  }
}

// Top深色主题样式
.el-header.darkTheme {
  background-color: #1e293b;
  color: #fff;

  .el-dropdown,
  .is-link {
    --el-text-color-regular: #fff;
  }
  .el-breadcrumb__inner.is-link,
  .el-breadcrumb__inner a {
    --el-text-color-regular: #fff;
    --el-text-color-primary: #fff;
  }
  .el-breadcrumb__inner {
    --el-text-color-regular: #fff;
    --el-text-color-primary: #fff;
  }
}

// 文件上传样式
.el-upload-dragger {
  padding: 0 !important;
}

/** 抽屉组件的header样式 */
.el-drawer__header {
  margin-bottom: 0 !important;
}
